<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="box">
        <lee :arr='arr'></lee>
    </div>
    <template id='lee'>
        <div>
            <div v-for='(i,$index) in lee_arr' style="border: 1px solid #ccc;">
                <div @click="index=$index">
                    {{i.title}}
                </div>
                <lee :arr="i.arr" style="margin-left: 2rem;" v-if="i.arr" v-show="index==$index"></lee>
            </div>
        </div>
    </template>
</body>
<script src="../js/vue.js"></script>
<script>
    Vue.component('lee',{
        template:'#lee',
        props:['arr'],
        data(){
            return{
                lee_arr:this.arr,
                index:0
            }
        }
    })
    new Vue({
        el:'#box',
        data:{
            arr:[{
                title: '北京',
                arr: [{
                    title: '北京市',
                    arr: [{
                            title: "大兴区"
                        },
                        {
                            title: "朝阳区"
                        },
                        {
                            title: "房山区"
                        }
                    ]
                }]
            },
            {
                title: '河南省',
                arr: [{
                        title: '郑州市',
                        arr: [{
                                title: "高新区"
                            },
                            {
                                title: "回管区"
                            }
                        ]
                    },
                    {
                        title: '新乡市',
                        arr: [{
                                title: "原阳县"
                            },
                            {
                                title: "小吉县"
                            },
                            {
                                title: "平原新区"
                            }
                        ]
                    }
                ]
            },
        ]
       },
    })
</script>
</html>